<template>
  <div class="audition261">
    <p> ref是React提供的用来操纵React组件实例或者DOM元素的接口</p>
    <p>在函数组件中使用方法：</p>
    <code class="code">
      import React, {<span class="color1">useRef</span>} from 'react'<br />
      <br />
      function xxxComponent() {<br />
        <span class="indient">const <span class="color2">inp</span> = <span class="color3">useRef</span>(<span class="color4">null</span>)</span><br />
        <span class="indient">const <span class="color5">handleClick</span> = () => {</span><br />
          <span class="indient2"><span class="color">inp</span>.<span class="color1">current</span>.focus()</span><br />
        <span class="indient">}</span><br />
        <span class="indient">return&lt;&gt;</span><br />
          <span class="indient2">&lt;input <span class="color2">ref</span>={<span class="color3">inp</span>} onClick={handleClick} /&gt;</span><br />
        <span class="indient">&lt;/&gt;</span><br />
      }
    </code>
  </div>
</template>

<script>
export default {
  name: 'Audition261'
}
</script>

<style>

</style>